<%@ include file="/WEB-INF/jsp/include/head.jsp" %><%@ page language="java" pageEncoding="UTF-8"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <%@ include file="/WEB-INF/jsp/include/title.jsp" %>
    <%@ include file="/WEB-INF/jsp/include/common_css.jsp" %>
    <style type="text/css" media="screen">
        <jsp:include page="./skin/default/css/default.css"/>
    </style>
    <%@ include file="/WEB-INF/jsp/include/common_script.jsp" %>
    <script type="text/javascript">
    //<![CDATA[
    function validate(view) {
    	var dbType = $("input:radio[name=databaseType]:checked").val();
    	
        if ('connection' == view) {
            if ($("input:text[id=" + dbType + "host]").val() == "" ||
                $("input:text[id=" + dbType + "port]").val() == "" ||
                $("input:text[id=" + dbType + "username]").val() == "" ||
                $("input:password[id=" + dbType + "password]").val() == "" ||
                $("input:text[id=" + dbType + "database]").val() == "") {
                
                alert('데이터베이스 정보를 모두 입력하세요');
                
                return false;
            }

            return true;
            
        } else if('createManager' == view) {
            if ($("#userId").val() == "" ||
                $("#passwd").val() == "" ||
                $("#userNick").val() == "" ||
                $("#email").val() == "") {
                
                alert('관리자 정보 똑바로 넣으삼~');
                
                return false;
            }

            return true;
        }
    }

    function installNext(screen) {
        if (screen == 'databaseSelect') {
            if ($("input:radio[name=agree]:checked").val() != "Y") {
                alert('위의 라이센스에 동의하지 않으면 게시판을 사용할 수 없습니다');
                $("input:radio[name=agree]:first").focus();
                return;
            }
        } else if(screen == "databaseSetting") {
            if (!$("input:radio[name=databaseType]:checked").val()) {
                alert('사용할 데이터베이스를 선택하세요');
                return;
            }
        } else if(screen == "complete") {
        	var dbType = $("input:radio[name=databaseType]:checked").val();
        	
            if(validate('createManager')) {
                $.post("<c:url value='/createManager.do'/>"
                     , { databaseType: dbType,
                         host: $("input:text[id=" + dbType + "host]").val(), //$("#host").val(),
                         port: $("input:text[id=" + dbType + "port]").val(), //$("#port").val(),
                         username: $("input:text[id=" + dbType + "username]").val(), //$("#username").val(),
                         password: $("input:password[id=" + dbType + "password]").val(), //$("#password").val(),
                         database: $("input:text[id=" + dbType + "database]").val(), //$("#database").val(),
                         version: $("#" + dbType + "version > option:selected").val(), //$("#version > option:selected").val(),                        
                         userId: $("#userId").val(),
                         passwd: $("#passwd").val(),
                         userNick: $("#userNick").val(),
                         email: $("#email").val(),
                         encoding: $("#caracterEncoding > option:selected").val() },
                     function(data, type) {
                         $.each(data.db, function(i, db) {
                             alert(db.isResult);
                         });
                     }, "json");
               
               return;
            }
        }
        
        display(screen);
    }

    function dbSelect() {
        if($("input:radio[name=databaseType]:checked").val() == 'oracle')
            display('oracleDatabaseSetting');
        else
            display('mysqlDatabaseSetting');
    }

    function display(screen) {
        $("#license").hide();
        $("#databaseSelect").hide();
        $("#mysqlDatabaseSetting").hide();
        $("#oracleDatabaseSetting").hide();
        $("#connectionCharacterSet").hide();
        $("#createManager").hide();
        $("#complete").hide();
        $("#" + screen).show();
    }

    $(document).ready(function() {
        display('license');

        $("#mysqlDbTest").click(function () {
            var dbType = $("input:radio[name=databaseType]:checked").val();
        	 
            if(validate('connection')) {
                $.post("<c:url value='/connectionDbTest.do'/>"
                     , { databaseType: dbType,
                         host: $("input:text[id=" + dbType + "host]").val(), //$("#host").val(),
                         port: $("input:text[id=" + dbType + "port]").val(), //$("#port").val(),
                         username: $("input:text[id=" + dbType + "username]").val(), //$("#username").val(),
                         password: $("input:password[id=" + dbType + "password]").val(), //$("#password").val(),
                         database: $("input:text[id=" + dbType + "database]").val(), //$("#database").val(),
                         version: $("#" + dbType + "version > option:selected").val() }, //$("#version > option:selected").val() },
                       function(data, type) {
                           $.each(data.db, function(i, db) {
                               alert(db.isResult);
                           });
                   }, "json");
            }
        });
        
        $("#oracleDbTest").click(function () {
            var dbType = $("input:radio[name=databaseType]:checked").val();
             
            if(validate('connection')) {
                $.post("<c:url value='/connectionDbTest.do'/>"
                     , { databaseType: dbType,
                         host: $("input:text[id=" + dbType + "host]").val(), //$("#host").val(),
                         port: $("input:text[id=" + dbType + "port]").val(), //$("#port").val(),
                         username: $("input:text[id=" + dbType + "username]").val(), //$("#username").val(),
                         password: $("input:password[id=" + dbType + "password]").val(), //$("#password").val(),
                         database: $("input:text[id=" + dbType + "database]").val(), //$("#database").val(),
                         version: $("#" + dbType + "version > option:selected").val() }, //$("#version > option:selected").val() },
                       function(data, type) {
                           $.each(data.db, function(i, db) {
                               alert(db.isResult);
                           });
                   }, "json");
            }
        });
        
        $("#characterEncoding").click(function () {
        	var dbType = $("input:radio[name=databaseType]:checked").val();
        	
            $.post("<c:url value='/characterEncodingTest.do'/>"
                 , { databaseType: dbType,
                     host: $("input:text[id=" + dbType + "host]").val(), //$("#host").val(),
                     port: $("input:text[id=" + dbType + "port]").val(), //$("#port").val(),
                     username: $("input:text[id=" + dbType + "username]").val(), //$("#username").val(),
                     password: $("input:password[id=" + dbType + "password]").val(), //$("#password").val(),
                     database: $("input:text[id=" + dbType + "database]").val(), //$("#database").val(),
                     version: $("#" + dbType + "version > option:selected").val(), //$("#version > option:selected").val(),
                     encoding: $("#caracterEncoding > option:selected").val(),
                     hangle: $("#hangle").val() },
                   function(data, type) {
                       $.each(data.db, function(i, db) {
                           alert(db.isResult);
                       });
               }, "json");
        });
        
        $("#dbCharactersetTest").click(function () {
        	var dbType = $("input:radio[name=databaseType]:checked").val();
        	
            $.post("<c:url value='/connectDbCharactersetTest.do'/>"
                 , { databaseType: dbType,
                     host: $("input:text[id=" + dbType + "host]").val(), //$("#host").val(),
                     port: $("input:text[id=" + dbType + "port]").val(), //$("#port").val(),
                     username: $("input:text[id=" + dbType + "username]").val(), //$("#username").val(),
                     password: $("input:password[id=" + dbType + "password]").val(), //$("#password").val(),
                     database: $("input:text[id=" + dbType + "database]").val() }, //$("#database").val() },
                   function(data, type) {
                       $.each(data.db, function(i, db) {
                           alert(db.isResult);
                       });
               }, "json");
        });
    });
    //]]>
    </script>
</head>
<body>
    <form:form id="frmInstall" method="post" action="install.do" enctype="multipart/form-data" modelAttribute="install">
    <input type="hidden" id="command" name="command" />
    <input type="hidden" id="hangle" name="hangle" value="한글 테스트" />
    <div id="license">
        <fieldset>
            <legend> License </legend>
            <table>
                <tr>
                    <td>
                        <textarea cols="100" rows="15" style="width: 100%" readonly="readonly"><%@ include file="license.jsp" %></textarea>
                        <br />
                        위의 라이센스를 모두 읽고 동의하십니까?
                        <input type="radio" name="agree" value="Y" />예 동의합니다 <input type="radio" name="agree" value="N" />아니오 동의하지 않습니다
                   </td>
               </tr>
        </table>
        </fieldset>
        <br/>
        <input type="button" style="width:70" value="다 음" onclick="installNext('databaseSelect')" /> 
        <input type="button" style="width:70" value="취 소" onclick="installCancel()" />
    </div>
    <div id="databaseSelect">
        <fieldset>
            <legend> Select Database </legend>
            <input type="radio" name="databaseType" value="oracle" /> Oracle
            <input type="radio" name="databaseType" value="mysql" /> MySQL
        </fieldset>
        <br />
        <input type="button" style="width:70" value="이 전" onclick="display('license')" />
        <input type="button" style="width:70" value="다 음" onclick="dbSelect()" />
        <input type="button" style="width:70" value="취 소" onclick="installCancel()" />        
    </div>
    <div id="mysqlDatabaseSetting">
        <fieldset>
            <legend>MYSQL Server Information</legend>
            <table>
                <tr>
                    <td>Version </td>
                    <td>
                        <select id="mysqlversion" name="version" style="width:134;height:20">
                            <option value="4.1">4.1 이상</option>
                            <option value="4.0">4.0 이하</option>
                        </select>                    
                    </td>
                </tr>
                <tr>
                    <td>Server Host</td>
                    <td><input type="text" id="mysqlhost" name="host" /> port <input type="text" id="mysqlport" name="port" size="5" value="3306" /></td>
                </tr>
                <tr>
                    <td>Username</td>
                    <td><input type="text" id="mysqlusername" name="username" /></td>
                </tr>
                <tr>
                    <td>Password</td>
                    <td><input type="password" id="mysqlpassword" name="password" /></td>
                </tr>
                <tr>
                    <td>Database Name</td>
                    <td><input type="text" id="mysqldatabase" name="database" /></td>
                </tr>
                <tr>
                    <td></td>
                    <td><input type="button" id="mysqlDbTest" style="width:80" value="테스트" /></td>
                </tr>
            </table>
        </fieldset> 
        <br />
        <input type="button" style="width:70" value="이 전" onclick="display('databaseSelect')" />
        <input type="button" style="width:70" value="다 음" onclick="installNext('connectionCharacterSet')" />
        <input type="button" style="width:70" value="취 소" onclick="installCancel()" />    
    </div>
    <div id="oracleDatabaseSetting">
        <fieldset>
            <legend>Oracle Server Information</legend>
            <table>
                <tr>
                    <td>Version </td>
                    <td>
                        <select id="oracleversion" name="version" style="width:134;height:20">
                            <option value="10.1">10g 10.1</option>
                            <option value="10.2">10g 10.2</option>
                        </select>                    
                    </td>
                </tr>
                <tr>
                    <td>Server Host</td>
                    <td><input type="text" id="oraclehost" name="host" /> port <input type="text" id="oracleport" name="port" size="5" value="1521" /></td>
                </tr>
                <tr>
                    <td>Username</td>
                    <td><input type="text" id="oracleusername" name="username" /></td>
                </tr>
                <tr>
                    <td>Password</td>
                    <td><input type="password" id="oraclepassword" name="password" /></td>
                </tr>
                <tr>
                    <td>Database Name</td>
                    <td><input type="text" id="oracledatabase" name="database" /></td>
                </tr>
                <tr>
                    <td></td>
                    <td><input type="button" id="oracleDbTest" style="width:80" value="테스트" /></td>
                </tr>
            </table>
        </fieldset> 
        <br />
        <input type="button" style="width:70" value="이 전" onclick="display('databaseSelect')" />
        <input type="button" style="width:70" value="다 음" onclick="installNext('connectionCharacterSet')" />
        <input type="button" style="width:70" value="취 소" onclick="installCancel()" />    
    </div>
    <div id="connectionCharacterSet">
        <fieldset>
            <legend>CharacterEncoding</legend>
            <select id="caracterEncoding" name="caracterEncoding" style="width:143">
                <option value="UTF8">UTF8</option>
                <option value="euckr">EUCKR</option>
            </select>
            <input type="button" id="characterEncoding" style="width:80" value="테스트" />
            <br />
            기본적으로 BBSSaga는 UTF8을 사용 합니다. 
        </fieldset>
        <%--
        <fieldset>
            <legend>Connect CharacterSet</legend>
            Encoding
            <input style="border:none" type="radio" name="encoding" value="Y" checked="checked" />예 
            <input style="border:none" type="radio" name="encoding" value="N" />아니요
            <input type="button" id="dbCharactersetTest" style="width:80" value="테스트" onclick="validate('characterset', true)" />
            <br />
            <select name=characterSet style=width:143>
                <option value=1>NO_NO</option>
                <option value=2>NO_KO</option>
                <option value=3>NO_EN</option>
                <option value=4>KO_NO</option>
                <option value=5>KO_KO</option>
                <option value=6>KO_EN</option>
                <option value=7>EN_NO</option>
                <option value=8>EN_KO</option>
                <option value=9>EN_EN</option>
            </select>
        </fieldset>
        <br />
        <fieldset>
            <legend>Upload CharacterSet</legend>
        한글파일명 선택
        <input type="file" name="koreanfile" style="font-size:9pt;width:221" />
        <input type="radio" name="upload" value="1" checked="checked" />NO
         <input type="radio" name="upload" value="2" />KO
         <input type="radio" name="upload" value="3" />EN
         <br />
         <input type="button" style="width:80" name="btn9" value="테스트" onclick="validate('upload', true)" />
         </fieldset>
        <br />
        <fieldset>
            <legend>Download CharacterSet</legend>
        Encoding
        <input type="radio" name="download" value="1" checked="checked" />NO
         <input type="radio" name="download" value="2" />KO
         <input type="radio" name="download" value="3" />EN
         <br />
        <input type="button" style="width:80" name="btn9" value="테스트" onclick="validate('download', true)" />
        <br />
        </fieldset>
        --%>   
        <br />
        <input type="button" style="width:70" value="이 전" onclick="dbSelect()" />
        <input type="button" style="width:70" value="다 음" onclick="installNext('createManager')" />
        <input type="button" style="width:70" value="취 소" onclick="installCancel()" />
    </div>
    <div id="createManager">
        <fieldset>
            <legend>Create Administrator</legend>
            <table>
                <tr>
                    <td>관리자 아이디</td>
                    <td><input type="text" id="userId" name="userId" /></td>
                </tr>
                <tr>
                    <td>비밀번호</td>
                    <td><input type="password" id="passwd" name="passwd" /></td>
                </tr>
                <tr>
                    <td>관리자 닉네임</td>
                    <td><input type="text" id="userNick" name="userNick" /></td>
                </tr>
                <tr>
                    <td>관리자 이메일</td>
                    <td><input type="text" id="email" name="email" /></td>
                </tr>
            </table>
        </fieldset>
        <br />
        <input type="button" style="width:70" value="이 전" onclick="display('connectionCharacterSet')" />
        <input type="button" style="width:70" value="종료" onclick="installNext('complete')" />
        <input type="button" style="width:70" value="취 소" onclick="installCancel()" />    
    </div>
    <div id="complete">
        설치중...
    </div>
    </form:form>
</body>
</html>